/*
 * @Description: 编辑报表
 * @Author: Zzt
 * @Date: 2022-11-28 15:39:59
 * @LastEditTime: 2022-12-05 10:43:12
 */

import { Button, Form, Modal } from 'antd';
import ItemForm from './common/ItemForm';
import { useAnnualReportContext } from '../../contexts/AnnualReportContext';
import { useEffect } from 'react';
import moment from 'moment';
import dayjs from 'dayjs';
const EditReport = (props: any) => {
  const { visible, data, onClose, able } = props;
  const { editReportList } = useAnnualReportContext();
  const [form] = Form.useForm();
  console.log('data', data);

  useEffect(() => {
    if (visible) {
      form.setFieldsValue({ ...data, recordTime: moment(data.recordTime) });
    } else {
      form.resetFields();
    }
  }, [visible]);
  // 新增档案类型
  const onFinish = (values: any) => {
    console.log(values);
    const recordTime = dayjs(values.recordTime).format('YYYY');
    editReportList({ ...data, ...values, recordTime }).then(() => {
      onCancel();
    });
  };

  const onFinishFailed = (errorInfo: any) => {
    console.log('Failed:', errorInfo);
  };
  // 提交表单
  const submitFunc = () => {
    form.submit();
  };
  const onCancel = () => {
    onClose();
  };
  return (
    <>
      <Modal
        destroyOnClose
        title={'修改年报'}
        visible={visible}
        // width={600}
        onCancel={onCancel}
        footer={[
          <Button key="back" onClick={onCancel}>
            取消
          </Button>,
          <Button key="submit" type="primary" onClick={submitFunc}>
            保存
          </Button>
        ]}
      >
        <Form
          labelCol={{ span: 6 }}
          wrapperCol={{ span: 18 }}
          preserve={false}
          form={form}
          onFinish={onFinish}
          onFinishFailed={onFinishFailed}
          disabled={able}
        >
          <ItemForm />
        </Form>
      </Modal>
    </>
  );
};
export default EditReport;
